<template>
  <div class="userBox">
    <el-card v-if="!getuser" shadow="always">
      <div slot="header" class="clearfix">
        <a href="/"  class="btn btn-info">登录</a>
      </div>
      <img
        width="100"
        src="https://cdn-hterobot.oss-cn-qingdao.aliyuncs.com/vue/public/forum/80e0a7176c643ec9a01e245f092df0fb.jpg"
        class="image"
      />
    </el-card>
    <el-card v-else shadow="always">
      <div slot="header" class="clearfix">
        <router-link
          :to="{name: 'user', params:{uid:  getuser.userid}}"
          class="btn btn-text"
          v-text="getuser.username"
        ></router-link>
      </div>
      <img width="100" :src="getuser.headimg" class="image" />

      <div class="row">
        <div class="col" @click="$router.push(`/user/${getuser.userid}`)">
          <i>
            <img
              class="actionIco"
              draggable="false"
              src="https://cdn-hterobot.oss-cn-qingdao.aliyuncs.com/vue/public/forum/tiezi.png"
            />
          </i>
          <div class="actionFont">帖子</div>
        </div>
        <div class="col" @click="$router.push(`/user/${getuser.userid}`)">
          <i>
            <img
              class="actionIco"
              draggable="false"
              src="https://cdn-hterobot.oss-cn-qingdao.aliyuncs.com/vue/public/forum/xiaoxi.png"
            />
          </i>
          <div class="actionFont">消息</div>
        </div>
        <div class="col" @click="$router.push(`/user/${getuser.userid}`)">
          <i>
            <img
              class="actionIco"
              draggable="false"
              src="https://cdn-hterobot.oss-cn-qingdao.aliyuncs.com/vue/public/forum/caogaoxiang.png"
            />
          </i>
          <div class="actionFont">草稿箱</div>
        </div>
        <div class="col" @click="$router.push(`/user/${getuser.userid}`)">
          <i>
            <img
              class="actionIco"
              draggable="false"
              src="https://cdn-hterobot.oss-cn-qingdao.aliyuncs.com/vue/public/forum/shoucang.png"
            />
          </i>
          <div class="actionFont">收藏</div>
        </div>
      </div>
    </el-card>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  async mounted() {},
  methods: {},
  computed: mapGetters(["getuser"])
};
</script>


<style lang='scss' scoped>
.userBox {
  text-align: center;
}
.row {
  margin-top: 45px;
  font-size: 12px;
  border-top: 1px solid #ebeef5;
  padding-top: 25px;
}
.row .col {
  cursor: pointer;
}
.row .col:hover {
  color: rgb(47, 129, 241);
}
</style>
